<template>
  <div class="gongshi">
    <el-dialog
      title="批示意见/办理提示"
      :visible.sync="dialogVisible"
      width="60%">
      <notice :noticePersonId="noticePersonId" :step="selStep"></notice>
      <span slot="footer" class="dialog-footer">
        <el-button type="primary" @click="dialogVisible = false">确 定</el-button>
      </span>
    </el-dialog>
    <el-breadcrumb separator=">">
      <el-breadcrumb-item :to="{ path: '/' }">系统首页</el-breadcrumb-item>
      <el-breadcrumb-item :to="{ path: '/selection' }">干部选任</el-breadcrumb-item>
      <el-breadcrumb-item>公示</el-breadcrumb-item>
    </el-breadcrumb>
    <section class="wboxnoborder">
      <div :style="'height:'+tableHeight+'px'">
        <el-scrollbar style="height: calc(100% + 16px);">
          <el-table
            border
            size="small"
            :data="tableData4"
            tooltip-effect="dark"
            style="width: 100%;"
            v-loading="listloading4"
            @selection-change="handleSelectionChange">
            <el-table-column
              type="selection"
              width="55">
            </el-table-column>
            <el-table-column
              label="序号"
              type="index"
              width="55">
            </el-table-column>
            <el-table-column
              prop="realName"
              label="姓名"
              width="80">
            </el-table-column>
            <el-table-column
              prop="unitName"
              width="200"
              label="选任岗位单位"
              show-overflow-tooltip>
            </el-table-column>
            <el-table-column
              prop="jobName"
              width="200"
              label="选任岗位职务"
              show-overflow-tooltip>
            </el-table-column>
            <el-table-column
              prop="jobLevel"
              label="选任岗位职级"
              width="120"
              show-overflow-tooltip>
            </el-table-column>
            <el-table-column
              prop="dateto"
              label="公示时间"
              width="180"
              show-overflow-tooltip>
            </el-table-column>
            <el-table-column label="附件">
              <template slot-scope="scope">
                <el-link type="primary"
                v-for="item of scope.row.files"
                :key="item.id"
                :href="$http.defaults.baseURL+$http.defaults.selectionAPI+'api/gen/file/download?id='+item.id"
                target="_blank">{{item.fileName}}.{{item.fileType}}</el-link>
              </template>
            </el-table-column>
            <el-table-column label="有无举报" width="100">
              <template slot-scope="scope">
                <span v-if="scope.row.jubao===1">有</span>
                <span v-else>无</span>
              </template>
            </el-table-column>
            <el-table-column label="是否影响任命" width="120">
              <template slot-scope="scope">
                <span v-if="scope.row.yingxiang===1">影响</span>
                <span v-else>不影响</span>
              </template>
            </el-table-column>
            <!-- <el-table-column label="后续环节" width="360">
              <template slot="header">
                <div style="color:#0000FF !important;font-weight:bolder;font-size:var(--size20) !important;font-family:'黑体'">后续环节</div>
              </template>
              <template slot-scope="scope">
                <el-radio-group v-model="scope.row.checkmsg">
                  <el-radio :label="1">报中组部备案</el-radio>
                  <el-radio :label="2">任职发文</el-radio>
                </el-radio-group>
              </template>
            </el-table-column> -->
            <el-table-column
              label="办理提示、批示意见"
              width="160">
              <template slot-scope="scope">
                <el-popover placement="bottom" width="600" trigger="hover">
                  <notice :noticePersonId="scope.row.personId" step="6"></notice>
                  <el-button size="small" slot="reference" type="primary" @click="showNotice(scope.row.personId)">查看详情</el-button>
                </el-popover>
              </template>
            </el-table-column>
          </el-table>
              <el-button type="success" :loading="finishloading" @click="saveComplete" style="margin:15px;">完成</el-button>
        </el-scrollbar>
      </div>
    </section>
  </div>
</template>

<script>
import notice from '../common/Notice'
export default {
  name: 'gongshi',
  data () {
    return {
      finishloading: false,
      listloading4: false,
      tableHeight: 100,
      activeName: 'fourth',
      radioGroup: '干部一处',
      dgsData: [], // 待公示 选择公示批次人员信息
      files: [],
      fileList: [], // 待公示 表单附件
      gongshiForm: { // 待公示 表单信息
        date: '',
        pickerOptions: {
          shortcuts: [{
            text: '最近一周',
            onClick (picker) {
              const end = new Date()
              const start = new Date()
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 7)
              picker.$emit('pick', [start, end])
            }
          }, {
            text: '最近一个月',
            onClick (picker) {
              const end = new Date()
              const start = new Date()
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 30)
              picker.$emit('pick', [start, end])
            }
          }]
        }
      },
      tableData4: [],
      selectPerson: [], // 公示完成 待报出
      selApi: 'api/selection/publicity/submitApprove',
      selStep: 6,
      deptid: 1,
      selectPerson2: [], // 已退回
      noticePersonId: '',
      dialogVisible: false
    }
  },
  components: {
    notice
  },
  mounted () {
    // 待公示 一处列表
    this.getList4(this.deptid)
    // resize
    this.tableresize(this)
    let _this = this
    window.onresize = function windowResize () {
      // 通过捕获系统的onresize事件触发我们需要执行的事件
      _this.tableresize(_this)
    }
  },
  methods: {
    saveComplete () {
      if (this.selectPerson.length === 0) {
        this.$message({
          message: '请至少选择一个人选',
          type: 'error'
        })
        return
      }
      let persons = []
      for (let i = 0; i < this.selectPerson.length; i++) {
        persons.push({
          personId: this.selectPerson[i].personId
        })
        // console.log('checkmsg:' + this.selectPerson[i].checkmsg)
        // if (this.selectPerson[i].checkmsg === 1) {
        //   persons.push({
        //     personId: this.selectPerson[i].personId,
        //     stateRecord: 0
        //   })
        // } else if (this.selectPerson[i].checkmsg === 2) {
        //   persons.push({
        //     personId: this.selectPerson[i].personId,
        //     stateRecord: -1,
        //     statePostDispatch: 0
        //   })
        // } else {
        //   this.$message({
        //     message: '请选择每一位勾选人选的后续环节',
        //     type: 'warning'
        //   })
        //   return
        // }
      }
      let para = {persons: persons}
      this.finishloading = true
      this.$http
        .post(this.$http.defaults.selectionAPI + `api/selection/publicity/updateNextStates`, para) // 需要新增讨论决定环节完成接口
        .then(response => {
          this.finishloading = false
          if (response.data.success) {
            this.$message({
              message: '公示完成',
              type: 'success'
            })
            this.getList4()
          }
        })
        .catch(error => {
          this.finishloading = false
          console.log(error)
        })
    },
    showNotice (id) { // 已批示 批示意见
      console.log('show notice id:', id)
      this.noticePersonId = id
      this.dialogVisible = true
    },
    getList4 (dc) { // 已退回
      this.listloading4 = true
      let url = this.$http.defaults.selectionAPI + 'api/selection/publicity/getApprove'
      // console.log(url)
      this.$http.get(url, {
        params: {
        }
      }).then(res => {
        this.listloading4 = false
        console.log('get list4 succ:', res)
        if (res.data.success === true) {
          let rs = res.data.result
          let arr = []
          for (let i of rs) {
            if ((i.tips === 1 || i.tips === 0) && (i.appointment === 1 || i.appointment === 0)) {
              arr.push({
                candidateUnit: i.candidateUnit,
                currentJob: i.currentJob,
                currentLevel: i.currentLevel,
                jobLevel: i.jobLevel,
                jobName: i.jobName,
                personId: i.personId,
                publicityBatchId: i.publicityBatchId,
                realName: i.realName,
                unitName: i.unitName,
                dateto: i.dateStart + '至' + i.dateEnd,
                files: i.files,
                jubao: i.tips,
                yingxiang: i.appointment
              })
            } else {
              arr.push({
                candidateUnit: i.candidateUnit,
                currentJob: i.currentJob,
                currentLevel: i.currentLevel,
                jobLevel: i.jobLevel,
                jobName: i.jobName,
                personId: i.personId,
                publicityBatchId: i.publicityBatchId,
                realName: i.realName,
                unitName: i.unitName,
                dateto: i.dateStart + '至' + i.dateEnd,
                files: i.files
              })
            }
          }
          this.tableData4 = arr
        } else {
          this.$message({
            message: '数据获取失败',
            type: 'error'
          })
        }
      })
    },
    handleSelectionChange (val) { // 已退回
      this.selectPerson = [...val]
    },
    tableresize (obj) {
      var clientHeight = 0
      if (document.body.clientHeight && document.documentElement.clientHeight) {
        clientHeight = (document.body.clientHeight < document.documentElement.clientHeight) ? document.body.clientHeight : document.documentElement.clientHeight
      } else {
        clientHeight = (document.body.clientHeight > document.documentElement.clientHeight) ? document.body.clientHeight : document.documentElement.clientHeight
      }
      obj.$nextTick(function () {
        obj.tableHeight = clientHeight - 145
      })
    }
  }
}
</script>
<style>
.gongshi .el-table--border td, .el-table--border th, .el-table__body-wrapper .el-table--border.is-scrolling-left~.el-table__fixed{
  border-bottom:1px solid #95B8E7;
}
.gongshi .el-table td, .el-table th.is-leaf{
  border-right:1px solid #95B8E7;
}
.gongshi .wboxnoborder .el-table{
  border: #95B8E7 solid 1px;
}
.gongshi .wboxnoborder .el-table th{
  font-weight: normal;
  background-image: linear-gradient(to bottom , #f8f8f8, #efefef);
  text-align: center;
  border-right: #95B8E7 solid 1px;
  border-bottom: #95B8E7 solid 1px;
  min-height: 30px;
  line-height:30px;
}
.gongshi .wboxnoborder .el-table td, .el-table th{
  padding:0;
  font-size:var(--size14) !important;
  line-height: 20px;
  font-family: '宋体';
  text-align: center;
}
.gongshi .el-table__row{
  height: 50px;
}
.gongshi .el-radio-group{
  width:100%;
}
.gongshi .el-radio-button{
  width: 33%;
}
.gongshi .el-radio-button__inner{
  width: 100%;
}
.gongshi .el-radio-button__orig-radio:checked+.el-radio-button__inner {
    color: #FFF;
    background-color: #67C23A;
    border-color: #67C23A;
    -webkit-box-shadow: -1px 0 0 0 #67C23A;
    box-shadow: -1px 0 0 0 #67C23A;
}
</style>
<style scoped>
.gongshi {
  width: 100%;
  box-sizing: border-box;
}
.gongshi .wboxnoborder {
  padding: 0;
  width: 100%;
  background-color: #fff;
  margin: 0 10px;
  overflow: hidden;
}
</style>
